<template>
  <div class="monitor-box">
    <div class="left-box">
      <div class="control-box">
        <div class="search-box box-shadow">
          <a-form>
            <a-form-item label="标段">
              <a-select
                  v-model:value="cellQueryFormState.sections[0].sectionId">
                <a-select-option
                    v-for="section in sections"
                    :key="section.sectionId" :value="section.sectionId">
                  {{section.sectionName}}
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="仅显示当日施工单元">
              <a-switch
                  :defaultChecked="cellQueryFormState.workToday==1"
                  @change="()=>{cellQueryFormState.workToday=cellQueryFormState.workToday==1?undefined:1}"/>
            </a-form-item>
            <a-form-item label="单元状态">
              <a-select
                  v-model:value="cellQueryFormState.status">
                <a-select-option
                    v-for="cellStatus in cellStatusDict.dict2"
                    :key="cellStatus.statusCode" :value="cellStatus.statusCode">
                  {{cellStatus.statusName}}
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="审批状态">
              <a-select
                  v-model:value="cellQueryFormState.checkStatus">
                <a-select-option
                    v-for="item in auditDict.dict"
                    :key="item.key" :value="item.key">
                  {{ auditDict.getValueByKey(item.key) }}
                </a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item label="单元名称">
              <a-input v-model:value="cellQueryFormState.cellName"></a-input>
            </a-form-item>
            <a-form-item>
              <a-button @click="getCellBaseInfoList" type="primary">查询</a-button>
            </a-form-item>
          </a-form>
        </div>
      </div>
      <div class="cell-table-box box-shadow">
        <div class="table-box-header">
          单元列表
        </div>
        <div class="table-box-center">
          <a-table
              :scroll="{y:setHeight('.table-box-center', 125) + 'px'}"
              :data-source="cellBaseInfoList.cellInfo"
              :rowKey="(record) => record.cellId"
              @change="getCellBaseInfoList"
              :pagination="{
                'current':cellBaseInfoList.startPage,
                'total':cellBaseInfoList.totalCount,
                'pageSize':cellBaseInfoList.everyPage,
                'showLessItems':true
              }">
            <a-table-column title="归属标段" data-index="sectionName"/>
            <a-table-column title="单元名称" data-index="cellName"/>
            <a-table-column title="工艺类型" data-index="kind" width="60px">
              <template #default="{text}" >
                {{ kindDict.getNameByCode(text) }}
              </template>
            </a-table-column>
            <a-table-column title="状态" data-index="checkStatus" width="60px">
              <template #default="{text}">
                <div :style="{color: auditDict.getColorByKey(text),border: '1px solid',borderRadius: '3px'}">
                  {{ auditDict.getValueByKey(text) }}
                </div>
              </template>
            </a-table-column>
            <a-table-column title="操作" data-index="cellId" width="60px">
              <template #default="{text,record}">
                <div class="icon-box">
                  <div @click="handleCell(record)">
                    <EditOutlined/>
                  </div>
                </div>
              </template>
            </a-table-column>
          </a-table>
        </div>
      </div>
    </div>
    <div class="right-box">
      <div class="base-info-box box-shadow">
        <a-descriptions :column="4">
          <a-descriptions-item label="单元名称" :span="1">
            {{inCellBaseInfo?inCellBaseInfo.cellName:'--'}}
          </a-descriptions-item>
          <a-descriptions-item label="创建时间" :span="1">
            {{inCellBaseInfo?inCellBaseInfo.gtmCreateTime:'--'}}
          </a-descriptions-item>
          <a-descriptions-item label="工艺类型" :span="1">
            {{inCellBaseInfo?kindDict.getNameByCode(inCellBaseInfo.kind):'--'}}
          </a-descriptions-item>
          <a-descriptions-item label="归属标段" :span="1">
            {{inCellBaseInfo?inCellBaseInfo.sectionName:'--'}}
          </a-descriptions-item>
          <a-descriptions-item label="区域面积" :span="1">
            {{inCellBaseInfo?inCellBaseInfo.area:'--'}}
          </a-descriptions-item>
          <a-descriptions-item label="创建账号" :span="1">
            {{inCellBaseInfo?inCellBaseInfo.userName:'--'}}
          </a-descriptions-item>
          <!-- 三检 -->
          <a-descriptions-item label="三检状态" :span="1">
            {{ tpiStatue ? tpiStatue : '--' }}
          </a-descriptions-item>
        </a-descriptions>
      </div>
      <div class="report-box box-shadow">
        <div class="report-title">
          数据报表
          <div class="audit-box">
            <a-button @click="()=>{auditSetInfo.auditPut.showModal = true}" :disabled="!inCellBaseInfo && !$store.getters['userinfo/isPermission'](inCellBaseInfo?.sectionId,inCellBaseInfo?.kind,0)" type="primary">提交审核</a-button>
            <a-button @click="()=>{auditSetInfo.auditPermit.showModal = true}" :disabled="!inCellBaseInfo && !$store.getters['userinfo/isPermission'](inCellBaseInfo?.sectionId,inCellBaseInfo?.kind,1)" type="primary">审核通过</a-button>
            <a-button @click="()=>{auditSetInfo.auditReject.showModal = true}" :disabled="!inCellBaseInfo && !$store.getters['userinfo/isPermission'](inCellBaseInfo?.sectionId,inCellBaseInfo?.kind,1)" type="primary">审核驳回</a-button>
            <a-button @click="getAuditLog(inCellBaseInfo.cellId)" :disabled="!inCellBaseInfo && !$store.getters['userinfo/isPermission'](inCellBaseInfo?.sectionId,inCellBaseInfo?.kind,2)" type="primary">记录查看</a-button>
          </div>
        </div>
        <div class="report-search-box">
          <span>报表类型</span>
          <a-select v-model:value="reportSel">
            <a-select-option :key="1" :value="1" v-if="ableNY">振动碾施工遍数</a-select-option>
            <a-select-option :key="2" :value="2" v-if="ableNY">振动碾碾压轨迹</a-select-option>
            <a-select-option :key="201" :value="201" v-if="ableNY">碾压报警详情</a-select-option>
            <!-- 三检 -->
            <a-select-option :key="5" :value="5" v-if="ableNY">三检信息</a-select-option>
            <a-select-option :key="3" :value="3" v-if="ableTP">摊铺轨迹</a-select-option>
<!--            <a-select-option :key="4" :value="4" v-if="ableTP">摊铺高程</a-select-option>-->
            <a-select-option :key="202" :value="202" v-if="ableTP">摊铺报警详情</a-select-option>
          </a-select>
          <a-button @click="getReport(inCellBaseInfo.cellId,reportSel)" :disabled="!inCellBaseInfo" type="primary">查询</a-button>
        </div>
        <div class="report-center">
          <div v-if="reportType < 100 && !showTpiList" class="img-container">
            <a-image
                v-if="reportImg"
                width="940px"
                height="530px"
                :src="reportImg"/>
          </div>
          <div v-if="reportType > 200" class="table-container">
            <a-table
                v-if="reportType==201"
                :scroll="{y:setHeight('.table-container', 125) + 'px'}"
                :data-source="reportWarn.info"
                :rowKey="(record,index)=>{return index}"
                @change="getCompWarnInfo"
                :pagination="{
                  'current':reportWarn.startPage,
                  'total':reportWarn.totalCount,
                  'pageSize':reportWarn.everyPage,
                  'showLessItems':true}">
              <a-table-column title="时间" data-index="gtmTime"/>
              <a-table-column title="机械名称" data-index="deviceName"/>
              <a-table-column title="设计速度(km/h)" data-index="deviceName">
                <template #default="{text}">
                  {{ reportWarn.design.toFixed(2) }}
                </template>
              </a-table-column>
              <a-table-column title="施工速度(km/h)" data-index="build">
                <template #default="{text}">
                  {{ text.toFixed(2) }}
                </template>
              </a-table-column>
            </a-table>
            <a-table
                v-if="reportType==202"
                :scroll="{y:setHeight('.table-container', 125) + 'px'}"
                :data-source="reportWarn.info"
                :rowKey="(record,index)=>{return index}"
                @change="getPaveWarnInfo"
                :pagination="{
                  'current':reportWarn.startPage,
                  'total':reportWarn.totalCount,
                  'pageSize':reportWarn.everyPage,
                  'showLessItems':true}">
              <a-table-column title="时间" data-index="gtmTime"/>
              <a-table-column title="机械名称" data-index="deviceName"/>
              <a-table-column title="设计高程(m)" data-index="deviceName">
                <template #default="{text}">
                  {{ reportWarn.design.toFixed(2) }}
                </template>
              </a-table-column>
              <a-table-column title="施工高程(m)" data-index="build">
                <template #default="{text}">
                  {{ text.toFixed(2) }}
                </template>
              </a-table-column>
            </a-table>
          </div>
          <!-- 三检 -->
          <TpiListModal :is-show="showTpiList" ref="sonTpiList"></TpiListModal>
        </div>
        <div v-if="reportType < 200 && !showTpiList" class="report-footer">
          <a-button @click="createTiledMap(inCellBaseInfo.cellId)" :disabled="!inCellBaseInfo">重新生成</a-button>
          <a-button @click="exportReport" :disabled="!inCellBaseInfo" type="primary">导出</a-button>
        </div>
      </div>
    </div>
  </div>
  <SModal
      title="提交审核"
      :width="450"
      :height="465"
      :is-show="auditSetInfo.auditPut.showModal"
      @closed="()=>{auditSetInfo.auditPut.showModal = false}">
    <div class="audit-set-box">
      <a-alert message="注意" type="info" show-icon>
        <template #description>
          1.请将施工单元内机械结束派遣后进行提交；<br/>
          2.审核阶段和审核通过后将无法修改施工单元参数；<br/>
          3.审核驳回后可继续修改施工单元参数；
        </template>
      </a-alert>
      <div class="audit-set-form-box">
        <a-form
            :labelCol="{style: 'width: 80px'}">
          <a-form-item label="归属标段">
            {{ inCellBaseInfo?inCellBaseInfo.sectionName:"" }}
          </a-form-item>
          <a-form-item label="单元名称">
            {{ inCellBaseInfo?inCellBaseInfo.cellName:"" }}
          </a-form-item>
          <a-form-item label="工艺">
            {{ inCellBaseInfo?kindDict.getNameByCode(inCellBaseInfo.kind):"" }}
          </a-form-item>
          <a-form-item label="状态">
            {{ inCellBaseInfo?auditDict.getValueByKey(inCellBaseInfo.checkStatus):"" }}
          </a-form-item>
          <a-form-item label="备注" :wrapperCol="{span:18}">
            <a-textarea
                v-model:value="auditSetInfo.auditPut.submitInfo.remark"
                :auto-size="{minRows: 2, maxRows: 5}"/>
          </a-form-item>
          <a-form-item class="audit-set-btn-bar">
            <a-button @click="commitCheck(inCellBaseInfo?.cellId,auditSetInfo.auditPut.submitInfo.remark)" type="primary">
              提交
            </a-button>
          </a-form-item>
        </a-form>
      </div>
    </div>
  </SModal>
  <SModal
      title="审核通过"
      :width="450"
      :height="465"
      :is-show="auditSetInfo.auditPermit.showModal"
      @closed="()=>{auditSetInfo.auditPermit.showModal = false}">
    <div class="audit-set-box">
      <a-alert message="注意" type="info" show-icon>
        <template #description>
          1.请将施工单元内机械结束派遣后进行提交；<br/>
          2.审核阶段和审核通过后将无法修改施工单元参数；<br/>
          3.审核驳回后可继续修改施工单元参数；
        </template>
      </a-alert>
      <div class="audit-set-form-box">
        <a-form
            :labelCol="{style: 'width: 80px'}">
          <a-form-item label="归属标段">
            {{ inCellBaseInfo?inCellBaseInfo.sectionName:"" }}
          </a-form-item>
          <a-form-item label="单元名称">
            {{ inCellBaseInfo?inCellBaseInfo.cellName:"" }}
          </a-form-item>
          <a-form-item label="工艺">
            {{ inCellBaseInfo?kindDict.getNameByCode(inCellBaseInfo.kind):"" }}
          </a-form-item>
          <a-form-item label="状态">
            {{ inCellBaseInfo?auditDict.getValueByKey(inCellBaseInfo.checkStatus):"" }}
          </a-form-item>
          <a-form-item label="备注" :wrapperCol="{span:18}">
            <a-textarea
                v-model:value="auditSetInfo.auditPermit.submitInfo.remark"
                :auto-size="{minRows: 2, maxRows: 5}"/>
          </a-form-item>
          <a-form-item class="audit-set-btn-bar">
            <a-button @click="commitPermit(inCellBaseInfo?.cellId,auditSetInfo.auditPermit.submitInfo.remark)" type="primary">
              提交
            </a-button>
          </a-form-item>
        </a-form>
      </div>
    </div>
  </SModal>
  <SModal
      title="审核驳回"
      :width="450"
      :height="465"
      :is-show="auditSetInfo.auditReject.showModal"
      @closed="()=>{auditSetInfo.auditReject.showModal = false}">
    <div class="audit-set-box">
      <a-alert message="注意" type="info" show-icon>
        <template #description>
          1.请将施工单元内机械结束派遣后进行提交；<br/>
          2.审核阶段和审核通过后将无法修改施工单元参数；<br/>
          3.审核驳回后可继续修改施工单元参数；
        </template>
      </a-alert>
      <div class="audit-set-form-box">
        <a-form
            :labelCol="{style: 'width: 80px'}">
          <a-form-item label="归属标段">
            {{ inCellBaseInfo?inCellBaseInfo.sectionName:"" }}
          </a-form-item>
          <a-form-item label="单元名称">
            {{ inCellBaseInfo?inCellBaseInfo.cellName:"" }}
          </a-form-item>
          <a-form-item label="工艺">
            {{ inCellBaseInfo?kindDict.getNameByCode(inCellBaseInfo.kind):"" }}
          </a-form-item>
          <a-form-item label="状态">
            {{ inCellBaseInfo?auditDict.getValueByKey(inCellBaseInfo.checkStatus):"" }}
          </a-form-item>
          <a-form-item label="备注" :wrapperCol="{span:18}">
            <a-textarea
                v-model:value="auditSetInfo.auditReject.submitInfo.remark"
                :auto-size="{ minRows: 2, maxRows: 5 }"/>
          </a-form-item>
          <a-form-item class="audit-set-btn-bar">
            <a-button @click="commitReject(inCellBaseInfo?.cellId,auditSetInfo.auditReject.submitInfo.remark)" type="primary">
              提交
            </a-button>
          </a-form-item>
        </a-form>
      </div>
    </div>
  </SModal>
  <SModal
      title="审核记录"
      width="460"
      :is-show="auditSetInfo.auditLogModal"
      @closed="()=>{auditSetInfo.auditLogModal = false}">
    <div class="log-box">
      <a-table
          :scroll="{y:`300px`}"
          :data-source="auditSetInfo.auditList"
          :rowKey="(record) => record.gtmCreate"
          :pagination="false">
        <a-table-column title="操作" data-index="kind"/>
        <a-table-column title="时间" data-index="gtmCreate"/>
        <a-table-column title="账号" data-index="userName"/>
        <a-table-column title="备注" data-index="content"/>
      </a-table>
    </div>
  </SModal>
</template>

<script lang="ts">
import {useStore} from "vuex"
import {defineComponent,reactive,ref,toRefs,onMounted,onBeforeUnmount} from "vue"
import {setHeight} from "@/utils/tableUtils"
import {cellBaseInfo} from "@/hooks/cell/index"
import kindDict from "@/dicts/kindDict"
import cellStatusDict from "@/dicts/cellStatusDict"
import {EditOutlined} from '@ant-design/icons-vue'
import axios from '@/utils/axios'
import qs from 'qs'
import {message} from "ant-design-vue"
import {Base64ToPng} from "@/utils/tyutils/index"
import {Throttle} from "@/utils/tyutils/index"
import auditDict from "@/dicts/auditDict";
import SModal from "@/components/SModal/index.vue";
import config from "@/config";
//三检
import TpiListModal from '@/components/SModal/TpiListModal.vue'

interface AuditInfo{
  showModal:false
  submitInfo: {
    cellId: number|null
    remark: string|null
  }
}

export default defineComponent({
  setup(){
    const store = useStore()
    const sections = ref(JSON.parse(JSON.stringify(store.getters["userinfo/getUserSection"])))
    const {
      cellQueryFormRef,cellQueryFormState,cellBaseInfoList,inCellBaseInfo,
      getCellBaseInfoList,setCellStatus,getCellBaseInfo
    } = cellBaseInfo()
    const reportInfo=reactive({
      reportSel: 1,
      reportType: 1,
      reportFileType: 'img',
      reportImg: <any>null,
      reportWarn: {
        startPage: 1,
        everyPage: 10,
        info: new Array()
      }
    })
    const ableNY = ref(true);
    const ableTP = ref(true);
    const auditSetInfo = reactive({
      auditPut:<AuditInfo>{
        showModal: false,
        submitInfo: {
          cellId: null,
          remark: null
        }
      },
      auditPermit:<AuditInfo>{
        showModal: false,
        submitInfo: {
          cellId: null,
          remark: null
        }
      },
      auditReject:<AuditInfo>{
        showModal: false,
        submitInfo: {
          cellId: null,
          remark: null
        }
      },
      auditLogModal: false,
      auditList: new Array()
    })

    // 三检
    let showTpiList = ref<boolean>(false)
    const sonTpiList = ref()
    const tpiStatue = ref()
    const getCellTpiStatue = (cellId: number) => {
      const userinfo = store.getters['userinfo/getUserInfo']
      if (userinfo) {
        const url =
            config.cityUrlPath + '/detection/work-unit/' + cellId + '/status'
        axios.get(url).then((res: any) => {
          if (res.success) {
            if (res.data.length > 0) {
              tpiStatue.value = res.data[0].status
            }
          }
        })
      }
    }
    // 三检状态
    const getAreaStatus = (cellId: number) => {
      const userinfo = store.getters['userinfo/getUserInfo']
      if (userinfo) {
        const url = config.cityUrlPath + '/detectionTest/detection/getAreaStatusbySysID?id=' + cellId
        axios.get(url).then((res: any) => {
          if (res.code == 0) {
            if (res.data == -1) {
              tpiStatue.value = '待检测'
            } else if (res.data == 0) {
              tpiStatue.value = '不合格'
            } else if (res.data == 1) {
              tpiStatue.value = '合格'
            }
          }
        })
      }
    }
    // 获取图形报告
    const getReport = (cellId:number, workType:number)=>{
      reportInfo.reportImg = null;
      reportInfo.reportWarn = {
        startPage: 1,
        everyPage: 10,
        info: new Array()
      };
      // 三检
      showTpiList.value = false
      reportInfo.reportType = workType;
      switch (workType){
        case 1:
        case 2:
          axios.post("/nyMap/reporter",qs.stringify({cellID:cellId,workType}),{
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            responseType:"arraybuffer"
          }).then((res:any)=>{
            reportInfo.reportImg = 'data:image/png;base64,' + btoa(new Uint8Array(res).reduce((data, byte) => data + String.fromCharCode(byte), ''))
          }).catch((err:any)=>{
            reportInfo.reportImg = null
            message.info("暂未施工")
          })
          break;
        case 5:
          showTpiList.value = true
          sonTpiList.value.tpiListInit(cellId)
          break
        case 201:
          getCompWarnInfo(null);
          break;
        case 202:
          getPaveWarnInfo(null);
          break;
      default:
        workType==3 ? workType=1 : workType=2
        axios.post("/tpMap/reporter",qs.stringify({cellID:cellId,workType}),{
          headers: {'Content-Type': 'application/x-www-form-urlencoded'},
          responseType:"arraybuffer"
        }).then((res:any)=>{
          reportInfo.reportImg = 'data:image/png;base64,' + btoa(new Uint8Array(res).reduce((data, byte) => data + String.fromCharCode(byte), ''))
        }).catch((err:any)=>{
          message.info("暂未施工")
        })
      }
    }

    /**
     * 获取碾压报警信息
     */
    const getCompWarnInfo = (pageInfo:any)=>{
      axios.post("/comp/findWarnDetail",{
        cellId: inCellBaseInfo.value.cellId,
        startPage: pageInfo ? pageInfo.current : reportInfo.reportWarn.startPage,
        everyPage: reportInfo.reportWarn.everyPage
      }).then((res:any)=>{
        if(res.success){
          reportInfo.reportWarn = res.data;
        }else{
          message.info(res.msg);
        }
      })
    }

    /**
     * 获取摊铺报警信息
     */
    const getPaveWarnInfo = (pageInfo:any)=>{
      axios.post("/pave/findWarnDetail",{
        cellId: inCellBaseInfo.value.cellId,
        startPage: pageInfo ? pageInfo.current : reportInfo.reportWarn.startPage,
        everyPage: reportInfo.reportWarn.everyPage
      }).then((res:any)=>{
        if(res.success){
          reportInfo.reportWarn = res.data;
        }else{
          message.info(res.msg);
        }
      })
    }

    // 图形报告导出
    const exportReport = ()=>{
      console.log(reportInfo.reportType )
      switch (reportInfo.reportType) {
        case 1:
          if(!reportInfo.reportImg){
            message.info("暂未施工")
            return
          }
          Base64ToPng(reportInfo.reportImg)
          break
        case 2:
          if(!reportInfo.reportImg){
            message.info("暂未施工")
            return
          }
          Base64ToPng(reportInfo.reportImg)
          break
        case 3:
          if(!reportInfo.reportImg){
            message.info("暂未施工")
            return
          }
          Base64ToPng(reportInfo.reportImg)
          break
        case 4:
          if(!reportInfo.reportImg){
            message.info("暂未施工")
            return
          }
          Base64ToPng(reportInfo.reportImg)
        default:
          break
      }
    }

    // 切换报表类型显示
    const handleCell = (cell:any)=>{
      let f1 = getCellBaseInfo(cell)
        Promise.all([f1]).then((res:any)=>{
          if(inCellBaseInfo.value.kind=="8"){
            ableNY.value=false
            ableTP.value=true
            reportInfo.reportSel=3
            reportInfo.reportType=3
          }else{
            ableNY.value=true
            ableTP.value=false
            reportInfo.reportSel=1
            reportInfo.reportType=1
          }
        })
      //三检
      // getCellTpiStatue(cell.cellId)
      // 新三检
      getAreaStatus(cell.cellId)
    }

    // 重新生成
    const createTiledMap = Throttle((cellId:number)=>{
      if(inCellBaseInfo.value.kind == "8") {
        axios.post("/tpMap/reCreatReport",
            qs.stringify({
              cellID:cellId,
              workType:reportInfo.reportType,
            }),{
              headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }).then((res:any)=>{
          if(res.success){
            getReport(inCellBaseInfo.value.cellId,reportInfo.reportType)
            message.info("重新生成成功")
          }else{
            message.info("重新生成失败")
          }
        })
      } else {
        axios.post("/nyMap/reCreatReport",
            qs.stringify({
              cellID:cellId,
              workType:reportInfo.reportType,
            }),{
              headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }).then((res:any)=>{
          if(res.success){
            getReport(inCellBaseInfo.value.cellId,reportInfo.reportType)
            message.info("重新生成成功")
          }else{
            message.info("重新生成失败")
          }
        })
      }
    },5)

    // 提交审核
    const commitCheck = (cellId:number,content:string)=>{
      axios.post("/common/commitCheck",{
        cellId: cellId,
        content: content
      }).then((res:any)=>{
        if(res.success){
          let cell = cellBaseInfoList.value.cellInfo.find((item:any)=>{
            return item.cellId === cellId
          })
          if(cell){
            cell.checkStatus = 1
          }
          message.info("提交成功")
          auditSetInfo.auditPut.showModal = false
        }else{
          message.info(res.msg)
        }
      })
    }

    // 通过审核
    const commitPermit = (cellId:number,content:string)=>{
      axios.post("/common/passCheck",{
        cellId: cellId,
        content: content
      }).then((res:any)=>{
        if(res.success){
          let cell = cellBaseInfoList.value.cellInfo.find((item:any)=>{
            return item.cellId === cellId
          })
          if(cell){
            cell.checkStatus = 3
          }
          message.info("提交成功")
          auditSetInfo.auditPermit.showModal = false
        }else{
          message.info(res.msg)
        }
      })
    }

    // 驳回审核
    const commitReject = (cellId:number,content:string)=>{
      axios.post("/common/dismissCheck",{
        cellId: cellId,
        content: content
      }).then((res:any)=>{
        if(res.success){
          let cell = cellBaseInfoList.value.cellInfo.find((item:any)=>{
            return item.cellId === cellId
          })
          if(cell){
            cell.checkStatus = 2
          }
          message.info("提交成功")
          auditSetInfo.auditReject.showModal = false
        }else{
          message.info(res.msg)
        }
      })
    }

    // 获取审核记录
    const getAuditLog = (cellId:number)=> {
      axios.post("/common/findCheck",{
        cellId: cellId,
      }).then((res:any)=>{
        if(res.success){
          auditSetInfo.auditList = res.data
          auditSetInfo.auditLogModal = true
        }else{
          message.info(res.msg)
        }
      })
    }

    onMounted(()=>{
      if(sections.value.length>0){
        cellQueryFormState.value.sections[0].sectionId = sections.value[0].sectionId
        cellQueryFormState.value.sections[0].kind = [8,9]
        getCellBaseInfoList(null)
      }
    })

    return{
      setHeight,
      sections,
      kindDict,
      cellStatusDict,
      ...toRefs(reportInfo),
      handleCell,
      getReport,
      exportReport,
      createTiledMap,
      cellQueryFormRef,cellQueryFormState,cellBaseInfoList,inCellBaseInfo,
      getCellBaseInfoList,setCellStatus,getCellBaseInfo,

      auditDict,
      auditSetInfo,
      commitCheck,
      commitPermit,
      commitReject,
      getAuditLog,

      ableNY,
      ableTP,
      reportInfo,

      getCompWarnInfo,
      getPaveWarnInfo,

      //三检
      showTpiList,
      sonTpiList,
      getCellTpiStatue,
      tpiStatue,
      // 新三检
      getAreaStatus
    }
  },
  components:{EditOutlined,SModal,TpiListModal}
})
</script>

<style lang="scss" scoped>
.monitor-box{
  display: flex;
  width: 100%;
  height: 100%;
  .left-box{
    display: flex;
    flex-direction: column;
    width: 360px;
    height: 100%;
    .control-box{
      display: flex;
      width: 100%;
      height: 312px;
      .search-box{
        width: 360px;
        height: 100%;
        padding: 12px 17px;
        box-sizing: border-box;
        ::v-deep label{
          color:#666666;
        }
        ::v-deep .ant-form-item{
          display: flex;
          margin-bottom: 10px;
        }
        ::v-deep .ant-form-item-control-wrapper{
          flex: 1;
        }
        ::v-deep .ant-select{
          width: 100%;
        }
      }
    }
    .cell-table-box{
      display: flex;
      flex-direction: column;
      width: 360px;
      flex: 1;
      margin-top: 20px;
      padding: 0 13px;
      .table-box-header{
        color: #333333;
        font-size: 18px;
        font-weight: bold;
        padding: 18px 0 10px 10px;
      }
      .table-box-center{
        width: 100%;
        flex: 1;
      }
    }
  }
  .right-box{
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
    margin-left: 20px;
    .base-info-box{
      width: 100%;
      height: 82px;
      padding: 14px 0 2px;
    }
    .report-box{
      display: flex;
      flex-direction: column;
      width: 100%;
      flex: 1;
      margin-top: 20px;
      .report-title{
        display: flex;
        color: #333333;
        font-size: 18px;
        font-weight: bold;
        padding: 18px 0 10px 34px;
        border-bottom: 1px solid #EDF0FB;
        .audit-box{
          flex: 1;
          display: flex;
          padding: 0 34px;
          justify-content: flex-end;
          ::v-deep >button{
            margin-left: 20px;
          }
        }
      }
      .report-search-box{
        padding: 18px 34px;
        >span{
          color: #666666;
          font-size: 14px;
          font-weight: bold;
          line-height: 32px;
          font-family: 'PingFangSC-Medium, PingFang SC';
        }
        ::v-deep .ant-select{
          width: 240px;
          margin: 0 8px;
        }
        ::v-deep button{
          margin-left: 80px;
        }
      }
      .report-center{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        flex: 1;
        .img-container{
          width: 940px;
          height: 530px;
        }
        .table-container{
          width: 1100px;
          height: 530px;
        }
      }
      .report-footer{
        display: flex;
        justify-content: flex-end;
        padding: 16px 34px;
        height: 64px;
        ::v-deep button{
          margin-left: 8px;
        }
      }
    }
  }
}
.audit-set-box{
  position: absolute;
  width: 100%;
  height: 376px;
  left: 0;
  ::v-deep .ant-alert-with-description{
    padding: 8px;
  }
  .audit-set-form-box{
    width: 100%;
    padding: 8px 24px;
    ::v-deep .ant-form{
      color: #666666;
    }
    ::v-deep .ant-form-item{
      margin-bottom: 0;
    }
    .audit-set-btn-bar{
      display: flex;
      justify-content: flex-end;
      margin-top: 15px;
    }
  }
}
</style>
